import { createStore } from 'vuex';
import Request from '@/api/request/request';
import urls from '@/api/request/urls';
import { Permission, User } from '@/types/interface/auth_interface';

export default createStore({
  state: {
    routes: <Permission[]>[], // 保存从服务端获取的路由数组
    loginUser: null, // 登录账户的信息
    token: null, // 用于保存与服务端交互的token。token的值必须要通过getter获取，防止刷新会丢失。之所以在这里设定是之后打算更换存储路径，这里封装方便后期修改
    routeMatched: [], // 当前路由匹配的完整路径，用于面包屑组件,
    person: { // 调试代码
      name: '李四',
    },
  },
  getters: {
    getLoginUser: (state) => state.loginUser, // 读取登录用户
    /* getLoginUserNickName: (state) => { // 读取登录用户的网名
      let nickName = '';
      let { loginUser } = state;
      if (loginUser != null) {
        nickName = (loginUser! as User).nickName!;
      }
      return nickName;
    },
    getLoginUserHeadImgUrl: (state) => { // 读取登录用户的头像
      let headImgUrl = '';
      let { loginUser } = state;
      if (loginUser != null) {
        headImgUrl = (loginUser! as User).headImgUrl!;
      }
      return headImgUrl;
    }, */
    getToken: (state) => sessionStorage.getItem('access_token'),
  },
  mutations: {
    setRoutes(state, value: Permission[]) { // 获取路由信息
      state.routes.splice(0);
      // let array = [...value];
      value.forEach((item) => {
        state.routes.push(item);
      });
    },
    clearRoutes(state) { // 清除路由信息
      state.routes.splice(0);
    },
    setLoginUser(state, value) { // 保存用户信息
      state.loginUser = value;
    },
    setToken(state, value) { // 设置token
      state.token = value;
      // 保存token
      sessionStorage.setItem('access_token', value);
    },
    removeToken(state) { // 移除token
      state.token = null;
      // 移除token
      sessionStorage.removeItem('access_token');
    },
    setRouteMatched(state, value) { // 赋值面包屑组件,value值是路由收尾的to.matched，即获取当前路由的每个路由节点的完整信息
      state.routeMatched = value;
    },
    setPerson(state, value) { // 调试代码
      state.person = value;
    },
  },
  actions: {
    async getRoutes(store) { // 从服务端加载账户的路由信息
      const responseData: any = await new Request(urls.API_URL_BACKSTAGE_USER_MENU).get();
      if (responseData.success) { // 如果已经登录
        store.commit('setRoutes', responseData.data);
      } else {
        store.commit('clearRoutes');
      }
    },
    async getAdmin(store) { // 从服务端加载当前登录账户的信息
      const responseData: any = await new Request(urls.API_URL_BACKSTAGE_LOGINUSER).get();
      if (responseData.success) { // 如果已经登录
        store.commit('setLoginUser', responseData.data);
      } else {
        store.commit('setLoginUser', null);
      }
    },
    logout(store) { // 清空登录信息
      // 清除token
      store.commit('removeToken', null);
      // 清空登录账户信息
      store.commit('setLoginUser', null);
      // 清空存储的路由信息，不能手动清空。否则用于注销时会导致无法删除动态路由
      // store.commit('clearRoutes');
    },
    // setPerson(store) { // 调试代码
    //   // store.commit('setPerson', { name: '李思思', sex: '女' });
    //   // setTimeout(() => {
    //   //   store.commit('setPerson', { name: '李思思', sex: '女' });
    //   // }, 1000);
    //   return new Promise((resolve, reject) => {
    //     setTimeout(() => {
    //       const time = new Date().valueOf();
    //       store.commit('setPerson', { name: '李思思', sex: '女' });
    //       resolve(1);
    //     }, 2000);
    //   });
    // },
  },
  modules: {
  },
});
